<!-- 添加顶部导航 -->
<el-header>
    <div class="header-left">
        <i class="el-icon-s-fold" @click="toggleCollapse"></i>
    </div>
    <div class="header-right">
        <!-- 消息通知 -->
        <div class="message-badge" @click="showMessages">
            <el-badge :value="3" class="message-icon">
                <i class="el-icon-bell"></i>
            </el-badge>
        </div>
        <!-- 用户信息 -->
        <div class="user-info">
                                 <span style="font-size: 12px;color: #97d645d1;">
                                    <i>{{role.name}}</i>
                                    <i>{{role.code}}</i>
                                </span>
            <el-dropdown trigger="click">
                                <span class="user-dropdown">
                                    <i class="el-icon-user-solid"></i>
                                    <span>{{tokenJson.username}}</span>
                                    <i class="el-icon-caret-bottom"></i>
                                </span>
                <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item>
                        <i class="el-icon-s-custom"></i>
                        <span>个人中心</span>
                    </el-dropdown-item>
                    <el-dropdown-item>
                        <i class="el-icon-setting"></i>
                        <span>系统设置</span>
                    </el-dropdown-item>
                    <el-dropdown-item >
                                        <span @click="logOutPage">
                                                <i class="el-icon-switch-button"></i>
                                                <span>退出登录</span>
                                        </span>
                    </el-dropdown-item>
                </el-dropdown-menu>
            </el-dropdown>
        </div>
    </div>
</el-header>